<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset='utf-8'>
</head>
    <style>
        *{
            list-style: none;
            margin:0px;
            padding:0px;
        }
        #list{
            width:140px;
            border:1px solid #999;
            box-shadow: 3px 3px 3px #ccc;
            position:absolute;
            padding:0px 10px;
            left:100px;
            top:100px;
            display:none;
        }
        #list li{
            width:120px;
            height:40px;
            line-height: 40px;
            padding:0px 10px;
            cursor: pointer;
        }
    </style>
<body>
       

        
</body>
    <ul id="list">
        <li>复制</li>
        <li>剪切</li>
        <li>黏贴</li>
        <li>迅雷下载</li>
        <li>potplayer打开</li>
    </ul>

    <script>
        var list = document.getElementById("list");

        document.oncontextmenu = function(en){
            var x = en.x;
            var y = en.y;
            
            list.style.left = x+'px';
            list.style.top = y+'px';
            // list.style.display = 'none';
            list.style.display = 'block';
            return false;
        }

        document.onclick = function(){
            list.style.display = 'none';
        }

        var lis = list.getElementsByTagName("li");
        for(var i=0;i<lis.length;i++)
        {
            lis[i].onmouseover = function(){
                this.style.backgroundColor = '#eee';
            }

            lis[i].onmouseout = function(){
                this.style.backgroundColor = '';
            }
        }

    </script>

  
</html>